import React from 'react'
import classNames from 'classnames'

interface Props {
  children?: React.ReactNode
  value: boolean
  onChange: (v: boolean) => void
}
const Switch: React.FC<Props> = (props) => {
  return (
    <div className="switch" onClick={() => props.onChange(!props.value)}>
      <h4>{props.children}</h4>
      <p className={classNames({ on: props.value })}>
        <span>{props.value ? '开' : '关'}</span>
      </p>
    </div>
  )
}

export default Switch